<template>
    <div>
        <el-row class="layout-page-heading">
            <el-col :span="16">
                <h3>编辑商户</h3>
                <el-breadcrumb separator="/">
                    <el-breadcrumb-item>基础管理</el-breadcrumb-item>
                    <el-breadcrumb-item :to="{ path: '/info/agent/list' }">商户管理</el-breadcrumb-item>
                    <el-breadcrumb-item>编辑商户</el-breadcrumb-item>
                </el-breadcrumb>
            </el-col>
            <el-col :span="8">
                <div class="layout-page-heading-action">
                    <el-button onclick="router.go(-1)"><i class="fa fa-chevron-left"></i>返回</el-button>
                    <el-button type="primary" @click="save"><i class="fa fa-save"></i>保存</el-button>
                </div>
            </el-col>
        </el-row>
        <div class="layout-page-box">
            <el-form label-width="160px" label-position="right" :model="agent" :rules="rules" ref="agent" class="search-form">
                <el-form-item label="名称" prop="name">
                    <el-input v-model="agent.name" placeholder="名称"></el-input>
                </el-form-item>
                <el-form-item label="负责人" prop="principal">
                    <el-input v-model="agent.principal" placeholder="负责人"></el-input>
                </el-form-item>
                <el-form-item label="手机号码" prop="mobile">
                    <el-input v-model="agent.mobile" placeholder="手机号码"></el-input>
                </el-form-item>
                <el-form-item label="签名" prop="signature">
                    <el-input v-model="agent.signature" placeholder="签名"></el-input>
                </el-form-item>
                <el-form-item label="负责人身份证号">
                    <el-input v-model="agent.id_card_no" placeholder="负责人身份证号"></el-input>
                </el-form-item>
                <el-form-item label="域名1" prop="domain1">
                    <el-input v-model="agent.domain1" placeholder="域名1"></el-input>
                </el-form-item>
                <el-form-item label="域名2">
                    <el-input v-model="agent.domain2" placeholder="域名2"></el-input>
                </el-form-item>
                <el-form-item label="域名3">
                    <el-input v-model="agent.domain3" placeholder="域名3"></el-input>
                </el-form-item>
                <el-form-item label="进件扣费(元/单)" prop="apply_service_fee">
                    <el-input v-model.number="agent.apply_service_fee" placeholder="进件扣费(元/单)"></el-input>
                </el-form-item>
                <el-form-item label="放款扣费(元/单)" prop="loan_service_fee">
                    <el-input v-model.number="agent.loan_service_fee" placeholder="放款扣费(元/单)"></el-input>
                </el-form-item>
                <el-form-item label="是否需要签名">
                    <el-switch v-model="agent.need_sign" ></el-switch>
                </el-form-item>
                <el-form-item label="产品名称" prop="product_name">
                    <el-input v-model="agent.product_name" placeholder="产品名称"></el-input>
                </el-form-item>
                <el-form-item label="产品周期(天)" prop="duration">
                    <el-input v-model.number="agent.duration" placeholder="产品周期(天)"></el-input>
                </el-form-item>
                <el-form-item label="产品最小额度(元)" prop="min">
                    <el-input v-model.number="agent.min" placeholder="产品最小额度(元)"></el-input>
                </el-form-item>
                <el-form-item label="产品最大额度(元)" prop="max">
                    <el-input v-model.number="agent.max" placeholder="产品最大额度(元)"></el-input>
                </el-form-item>
                <el-form-item label="所属代理">
                    <el-select
                            v-model="agent.parent_id"
                            filterable
                            clearable
                            placeholder="请选择所属代理">
                        <el-option
                                v-for="item in agents"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>

<script>
    export default {
        data () {
            return {
                agent: {
                    id: '',
                    name: '',
                    mobile: '',
                    signature: '',
                    principal: '',
                    id_card_no: '',
                    domain: [],
                    domain1: '',
                    domain2: '',
                    domain3: '',
                    apply_service_fee: 5,
                    loan_service_fee: 5,
                    parent_id: '',
                    need_sign:false,
                    min:1000,
                    max:3000,
                    duration:7,
                    product_name:'云条',
                },
                agents: [],
                rules: {
                    name: [
                        {required: true, message: '请输入姓名', trigger: 'blur'},
                    ],
                    principal: [
                        {required: true, message: '请输入负责人', trigger: 'blur'}
                    ],
                    mobile: [
                        {required: true, message: '请输入手机号码', trigger: 'blur'}
                    ],
                    signature: [
                        {required: true, message: '请输入签名', trigger: 'blur'}
                    ],
                    domain1: [
                        {required: true, message: '请输入域名', trigger: 'blur'}
                    ],
                    apply_service_fee: [
                        {required: true, message: '请输入进件扣费', trigger: 'blur'},
                        {type: 'number', message: '请输入正确的金额', trigger: 'blur'}
                    ],
                    loan_service_fee: [
                        {required: true, message: '请输入放款扣费', trigger: 'blur'},
                        {type: 'number', message: '请输入正确的金额', trigger: 'blur'}
                    ],
                    min:[
                        {required: true, message: '请输入最小借款金额', trigger: 'blur'},
                        {type: 'number', message: '请输入正确的金额', trigger: 'blur'}
                    ],
                    max:[
                        {required: true, message: '请输入最大借款金额', trigger: 'blur'},
                        {type: 'number', message: '请输入正确的金额', trigger: 'blur'}
                    ],
                    duration:[
                        {required: true, message: '请输入借款周期', trigger: 'blur'},
                        {type: 'number', message: '请输入正确的周期', trigger: 'blur'}
                    ],
                    product_name:[
                        {required: true, message: '请输入产品名称', trigger: 'blur'},
                    ],                    
                }
            }
        },
        methods: {
            get(){
                api.request('info/agent/get', {
                    id: this.$route.query.id
                }, 'POST').then((res)=> {

                    for (const key in res.data) {
                        const element = res.data[key];
                        this.agent[key] = element;
                    }

                    if(this.agent.domain.length > 0){
                        this.agent.domain1 = this.agent.domain[0];
                    }
                    if(this.agent.domain.length > 1){
                        this.agent.domain2 = this.agent.domain[1];
                    }
                    if(this.agent.domain.length > 2){
                        this.agent.domain3 = this.agent.domain[2];
                    }

                    this.agent.product_name = this.agent.product_name || '云条';
                    this.agent.duration = this.agent.duration || 0;
                    this.agent.min = this.agent.min || 0;
                    this.agent.min = this.agent.min / 1000;
                    this.agent.max = this.agent.max || 0;
                    this.agent.max = this.agent.max / 1000;
                })
            },
            save(){
                var domains = [];
                if(this.agent.domain1){
                    domains.push(this.agent.domain1);
                }
                if(this.agent.domain2){
                    domains.push(this.agent.domain2);
                }
                if(this.agent.domain3){
                    domains.push(this.agent.domain3);
                }
                var data = {
                    id: this.$route.query.id,
                    name: this.agent.name,
                    signature: this.agent.signature,
                    principal: this.agent.principal,
                    mobile: this.agent.mobile,
                    id_card_no: this.agent.id_card_no,
                    domain: domains,
                    apply_service_fee: this.agent.apply_service_fee,
                    loan_service_fee: this.agent.loan_service_fee,
                    parent_id: this.agent.parent_id,
                    need_sign:this.agent.need_sign,
                    min: this.agent.min*1000,
                    max:this.agent.max*1000,
                    duration: this.agent.duration,
                    product_name:this.agent.product_name,   
                }

                this.$refs.agent.validate((valid)=> {
                    if (valid) {
                        api.request('info/agent/update', data, 'POST').then((res)=> {
                            _g.toast('success', '保存成功')
                            router.go(-1)
                        })
                    }
                })

            },
            init(){
                api.request('info/agent/all', {}, 'POST').then((res)=> {
                    
                    this.agents = res.data
                })
            }
        },
        created() {
            this.init()
            this.get()
        }
    }
</script>

<style scoped>


</style>
